<!DOCTYPE html>
<html lang="@@{website_lang}" dir="@@{website_dirLTR}">
<head>
	<meta charset="@@{website_charset}" />
	<title>Sample Page 2 - @@{website_title}</title>	
	@@include('./src/components/_global/include-header.html')
</head>  

 
  <body class="page">
  
  
          
    @@include('./src/components/_global/include-loader.html')
    @@include('./src/components/_global/include-toggle-trigger.html')
    

  
  
    <div class="uix-wrapper">
    
        <!-- Header Area
        ============================================= -->      
        <header class="uix-header__container">
            
             <div class="uix-header">
                 <div class="container">
                 
                        @@include('./src/components/_global/include-brand.html')
                        
                        @@include('./src/components/_global/include-menu.html')
                        
                        
                        
                  </div>
                  <!-- .container end -->
                  
                  <div class="uix-clearfix"></div>
             </div>
        
        </header>
		<div class="uix-header__placeholder js-uix-header__placeholder-autoheight"></div>
		
 
		<main id="uix-maincontent">
			
		   <!-- Parallax
			====================================================== -->
			<section>
				<div class="uix-parallax uix-height--70" data-fully-visible="false" data-offset-top="0" data-overlay-bg="false" data-skew="0" data-speed="0.4">
					<img class="uix-parallax__img" src="assets/images/demo/spiral-galaxy-1920x1080.jpg" alt="">
					<div class="uix-v-align--absolute uix-t-c uix-typo--color-white">
							<h2>Uix Kit Released!</h2>
						<p class="uix-typo--h5 uix-typo--style-normal">Make over <span class="uix-typo--h4 uix-typo--style-underline uix-typo--style-bold" data-counter-number="100" data-counter-double-digits="true" data-counter-dilimiter="true" data-counter-duration="100">00</span><span class="uix-typo--h4 uix-typo--style-underline uix-typo--style-bold">+</span> components to wear again and again!</p>
							<a href="#" class="uix-btn uix-btn__border--thin uix-btn__size--s uix-btn__bg--secondary is-pill">Free Download</a>
					</div>
				</div>
			</section>     



		   <!-- Section
			====================================================== -->
			<section>
				<div class="container">

					<div class="uix-container__bg uix-container__bg--white uix-container__bg--shadow uix-container__bg--totop-small uix-container__bg--rounded-medium uix-t-c">

						<div class="row js-uix-common-height uix-typo--color-white">


							<div class="col-lg-4 col-md-4 uix-relative" style="background-color: rgb(222, 14, 14);">

								<div style="padding: 2rem;">

									<h3 class="uix-typo--style-uppercase" style="font-weight: 600;">Why choose Us</h3>

									<p>Transform, agency working families thinkers who make change happen communities.</p>

									<a href="#" class="uix-btn uix-btn__border--thin uix-btn__size--s uix-btn__bg--secondary">Read More</a>

								</div>

								<i class="fa fa-bullhorn" aria-hidden="true" style="font-size: 10rem; opacity: .2;
		position: absolute; right: -2rem; bottom: -2rem; z-index: 0;"></i>

							</div>



							<div class="col-lg-4 col-md-4 uix-relative" style="background-color: rgb(214, 12, 12);">

								<div style="padding: 2rem;">

									<h3 class="uix-typo--style-uppercase" style="font-weight: 600;">Our Mission</h3>

									<p>Frontline respond, visionary collaborative cities advancement overcome injustice, UNHCR public-private partnerships cause. Giving, country educate rights-based approach; leverage disrupt solution.</p>

									<a href="#" class="uix-btn uix-btn__border--thin uix-btn__size--s uix-btn__bg--secondary">Read More</a>

								</div>

								<i class="fa fa-cogs" aria-hidden="true" style="font-size: 10rem; opacity: .2;
		position: absolute; right: -2rem; bottom: -2rem; z-index: 0;"></i>

							</div>



							<div class="col-lg-4 col-md-4 uix-relative" style="background-color: rgb(202, 1, 2);">

								<div style="padding: 2rem;">

									<h3 class="uix-typo--style-uppercase" style="font-weight: 600;">What you get</h3>

									<p>Sustainability involvement fundraising campaign connect carbon rights, collaborative cities convener truth.</p>

									<a href="#" class="uix-btn uix-btn__border--thin uix-btn__size--s uix-btn__bg--secondary">Read More</a>


								</div>

								<i class="fa fa-flask" aria-hidden="true" style="font-size: 10rem; opacity: .2;
		position: absolute; right: -2rem; bottom: -2rem; z-index: 0;"></i>

							</div>




						</div>
						<!-- .row end -->


					</div>
					<!-- .uix-container__bg end -->              

				</div>
				<!-- .container end -->

			</section>






			<!-- Content
			====================================================== -->
			<section class="uix-spacing--s">
				<div class="container uix-t-c">
						<div class="row uix-el--transparent" data-uix-anim='{"viewport":"100%","from":{"opacity":0,"y":150},"to":{"opacity":1,"y":0},"ease":"Power2.easeOut","duration":0.4,"delay":0,"infinite":false}'>
							<div class="col-12">


								<div class="uix-testimonials">

								   <div role="slider" class="uix-flexslider"
										 data-draggable="true" 
										 data-my-nav-thumbs="false"
										 data-my-prev-next-thumbs="false"
										 data-my-nav-timeline="false"
										 data-my-controls=".uix-testimonials__controls"
										 data-my-multiple-items="false"
										 data-my-multiple-items-move="1"
										 data-my-count-total="false"
										 data-my-count-now="false"
										 data-my-parallax="false"
										 data-my-sync="false"
										 data-wheel="true"
										 data-speed="600" 
										 data-timing="10000" 
										 data-loop="true" 
										 data-paging="true" 
										 data-arrows="false" 
										 data-animation="slide" 
										 data-auto="true" 
										 data-prev="<i class='fa fa-chevron-left'></i>" 
										 data-next="<i class='fa fa-chevron-right'></i>"> 	 

										<div class="uix-flexslider__inner">

											<div class="uix-flexslider__item">
												<div class="uix-testimonials__content">
													<p>Enter some details for the customer giving this testimonial., E.g., Thank you from the bottom of our hearts.</p>

													<div class="uix-testimonials__signature"> 
														<span class="uix-testimonials__signature--avatar uix-border--circle uix-border--circle-only-img"><img src="assets/images/demo/avatar.jpg"</span>
														<strong class="uix-testimonials__signature__shorttext">Name</strong> - Position 
													</div>	

												</div>
											</div>

											<div class="uix-flexslider__item">
												<div class="uix-testimonials__content">
													<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duarum enim vitarum nobis erunt instituta capienda. Tamen aberramus a proposito, et, ne longius, prorsus, inquam, Piso, si ista mala sunt, placet. Quae fere omnia appellantur uno ingenii nomine, easque virtutes qui habent, ingeniosi vocantur. Ut proverbia non nulla veriora sint quam vestra dogmata. Ergo ita: non posse honeste vivi, nisi honeste vivatur? Duo Reges: constructio interrete. Obsecro, inquit, Torquate, haec dicit Epicurus? Sunt enim prima elementa naturae, quibus auctis vírtutis quasi germen efficitur.</p>
													<div class="uix-testimonials__signature"> 
														<span class="uix-testimonials__signature--avatar uix-border--circle uix-border--circle-only-img"><img src="assets/images/demo/avatar.jpg"</span> 
														<strong class="uix-testimonials__signature__shorttext">Name</strong> - Position 
													</div>	


												</div>
											</div>


											<div class="uix-flexslider__item">
												<div class="uix-testimonials__content">
													<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duarum enim vitarum nobis erunt instituta capienda. Tamen aberramus a proposito, et, ne longius, prorsus, inquam, Piso, si ista mala sunt, placet. Quae fere omnia appellantur uno ingenii nomine, easque virtutes qui habent, ingeniosi vocantur. Ut proverbia non nulla veriora sint quam vestra dogmata. Ergo ita: non posse honeste vivi, nisi honeste vivatur? Duo Reges: constructio interrete. Obsecro, inquit, Torquate, haec dicit Epicurus? Sunt enim prima elementa naturae, quibus auctis vírtutis quasi germen efficitur.</p>

													<div class="uix-testimonials__signature"> 
														<span class="uix-testimonials__signature--no-avatar"></span> 
														<strong class="uix-testimonials__signature__shorttext">Name</strong> - Position 
													</div> 

												</div>
											</div>



										</div>
										<!-- .uix-flexslider__inner end -->
									</div>
									<!-- .uix-flexslider end -->   



								</div>
								<!-- /.uix-testimonials -->

								<div class="uix-flexslider__mycontrols uix-testimonials__controls">
									<div class="uix-flexslider__mycontrols__control-paging"></div>
								</div> 



							</div>
						</div>
						<!-- .row end -->


				</div>
				<!-- .container end -->

			</section>





		   <!-- Section Title
			====================================================== -->
			<section>
				<div class="container uix-t-c">
						<div class="row uix-el--transparent" data-uix-anim='{"viewport":"100%","from":{"opacity":0,"y":150},"to":{"opacity":1,"y":0},"ease":"Power2.easeOut","duration":0.4,"delay":0,"infinite":false}'>
							<div class="col-12">
								<h2 class="uix-heading--underline"><span>Latest Posts</span></h2> 

							</div>
						</div>
						<!-- .row end -->


				</div>
				<!-- .container end -->

			</section>



			<!-- Content
			====================================================== -->
			<section class="uix-spacing--s">
				<div class="container">
						<div class="row uix-el--transparent" data-uix-anim='{"viewport":"100%","from":{"opacity":0,"y":150},"to":{"opacity":1,"y":0},"ease":"Power2.easeOut","duration":0.4,"delay":0,"infinite":false}'>
							<div class="col-12">


								<div class="row">
									<div class="col-lg-6 col-md-6">
                                        
                                        <div class="uix-card--gallery uix-card--gallery--overlay" role="figure">
                                            <div class="uix-card--gallery__preview uix-core-grid__col-12 uix-core-grid__mobile-stack">
                                                <!-- image begin -->
                                                <img src="assets/images/demo/test-img-big-1.jpg" alt="">
                                                <!-- image end -->

                                            </div>
                                            <div class="uix-card--gallery__body">
                                                <div class="uix-card--gallery__header">
                                                    <div class="uix-card--gallery__header__child">
                                                        <!-- content begin -->
                                                        <span class="uix-typo--color-white" style="margin: 30px; display: block;">
                                                            <small class="uix-typo--color-sub">Categories</small>
                                                            <h4 class="uix-spacing--no">Full-stack Designer</h4>
                                                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                                                        </span>
                                                        <!-- content end -->
                                                        
                                                    </div>

                                                </div>
                                            </div>
                                        </div>        
                                            

									</div>     


									<div class="col-lg-6 col-md-6">
                                        
                                        <div class="uix-card--gallery uix-card--gallery--overlay" role="figure">
                                            <div class="uix-card--gallery__preview uix-core-grid__col-12 uix-core-grid__mobile-stack">
                                                <!-- image begin -->
                                                <img src="assets/images/demo/test-img-big-2.jpg" alt="">
                                                <!-- image end -->

                                            </div>
                                            <div class="uix-card--gallery__body">
                                                <div class="uix-card--gallery__header">
                                                    <div class="uix-card--gallery__header__child">
                                                        <!-- content begin -->
                                                        <span class="uix-typo--color-white" style="margin: 30px; display: block;">
                                                            <small class="uix-typo--color-sub">Categories</small>
                                                            <h4 class="uix-spacing--no">Full-stack Designer</h4>
                                                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                                                        </span>
                                                        <!-- content end -->
                                                        
                                                    </div>

                                                </div>
                                            </div>
                                        </div>    


									</div>     
								</div>
								<!-- .row end -->



							</div>
						</div>
						<!-- .row end -->


				</div>
				<!-- .container end -->

			</section>




		   <!-- Section Title
			====================================================== -->
			<section>
				<div class="container uix-t-c">
						<div class="row uix-el--transparent" data-uix-anim='{"viewport":"100%","from":{"opacity":0,"y":150},"to":{"opacity":1,"y":0},"ease":"Power2.easeOut","duration":0.4,"delay":0,"infinite":false}'>
							<div class="col-12">
								<h2 class="uix-heading--underline"><span>Portfolio</span></h2> 

							</div>
						</div>
						<!-- .row end -->


				</div>
				<!-- .container end -->

			</section>


			<!-- Content
			====================================================== -->
			<div class="uix-spacing--s uix-spacing--no-top">
				<div class="container">
						<div class="row uix-el--transparent" data-uix-anim='{"viewport":"100%","from":{"opacity":0,"y":150},"to":{"opacity":1,"y":0},"ease":"Power2.easeOut","duration":0.4,"delay":0,"infinite":false}'>
							<div class="col-12">

									<div class="uix-nav uix-nav--separation uix-t-c" id="js-uix-navfilter-1">
										<ul>
											<li class="current-cat"><a data-group="all" href="#">All</a></li>
											<li><a data-group="web-design" href="#">Web Design</a></li>
											<li><a data-group="ui" href="#">UI</a></li>
											<li><a data-group="seo" href="#">SEO</a></li>  
										</ul>
									</div>


									 <div class="uix-spacing--s uix-spacing--no-bottom">
                                        <div class="uix-gallery" data-show-type="filter" data-filter-id="#js-uix-navfilter-1">

                                            <div class="uix-gallery__tiles">

                                                <!-- Item -->
                                                <article class="uix-core-grid__col-4 uix-gallery__item" data-groups='["web-design","seo"]'>

                                                    <div>
                                                        <a href="#" class="uix-gallery__image" >
                                                            <div class="uix-gallery__image-cover">
                                                                <img src="assets/images/demo/test-img-big-1.jpg" alt="" />
                                                            </div>
                                                        </a>
                                                        <h3>
                                                            <a href="#">Project Title Here</a>
                                                            <span class="uix-gallery__title">Beautiful WordPress Theme</span>
                                                        </h3>

                                                    </div>



                                                </article>
                                                <!--  .uix-gallery__item  end -->  





                                                <!-- Item -->
                                                <article class="uix-core-grid__col-4 uix-gallery__item" data-groups='["web-design"]'>

                                                    <div>

                                                        <a href="#" class="uix-gallery__image" >
                                                            <div class="uix-gallery__image-cover">
                                                                <img src="assets/images/demo/test-img-big-2.jpg" alt="" />
                                                            </div>
                                                        </a>
                                                        <h3>
                                                            <a href="#">Project Title Here</a>
                                                            <span class="uix-gallery__title">Beautiful WordPress Theme</span>

                                                        </h3>


                                                    </div>


                                                </article>
                                                <!--  .uix-gallery__item  end -->             

                                                <!-- Item -->
                                                <article class="uix-core-grid__col-4 uix-gallery__item" data-groups='["web-design"]'>

                                                    <div>

                                                        <a href="#" class="uix-gallery__image" >
                                                            <div class="uix-gallery__image-cover">
                                                                <img src="assets/images/demo/test-img-big-3.jpg" alt="" />
                                                            </div>
                                                        </a>
                                                        <h3>
                                                            <a href="#">Project Title Here</a>
                                                            <span class="uix-gallery__title">Beautiful WordPress Theme</span>

                                                        </h3>

                                                    </div>


                                                </article>
                                                <!--  .uix-gallery__item  end -->  


                                                 <!-- Item -->
                                                <article class="uix-core-grid__col-4 uix-gallery__item" data-groups='["seo"]'>

                                                    <div>
                                                        <a href="#" class="uix-gallery__image" >
                                                            <div class="uix-gallery__image-cover">
                                                                <img src="assets/images/demo/test-img-big-4.jpg" alt="" />
                                                            </div>
                                                        </a>
                                                        <h3>
                                                            <a href="#">Project Title Here</a>
                                                            <span class="uix-gallery__title">Commerce Theme</span>

                                                        </h3>

                                                    </div>



                                                </article>
                                                <!--  .uix-gallery__item  end -->  


                                                <!-- Item -->
                                                <article class="uix-core-grid__col-4 uix-gallery__item" data-groups='["ui"]'>

                                                    <div>

                                                        <a href="#" class="uix-gallery__image" >
                                                            <div class="uix-gallery__image-cover">
                                                                <img src="assets/images/demo/test-img-big-5.jpg" alt="" />
                                                            </div>
                                                        </a>
                                                        <h3>
                                                            <a href="#">Project Title Here</a>
                                                            <span class="uix-gallery__title">Simple WordPress Theme</span>

                                                        </h3>

                                                    </div>


                                                </article>
                                                <!--  .uix-gallery__item  end -->        


                                                <!-- Item -->
                                                <article class="uix-core-grid__col-4 uix-gallery__item" data-groups='["web-design"]'>

                                                    <div>

                                                        <a href="#" class="uix-gallery__image" >
                                                            <div class="uix-gallery__image-cover">
                                                                <img src="assets/images/demo/test-img-big-2.jpg" alt="" />
                                                            </div>
                                                        </a>
                                                        <h3>
                                                            <a href="#">Project Title Here</a>
                                                            <span class="uix-gallery__title">Beautiful WordPress Theme</span>

                                                        </h3>


                                                    </div>


                                                </article>
                                                <!--  .uix-gallery__item  end -->           										        





                                            </div>
                                            <!-- .uix-gallery__tiles end -->


                                        </div>
                                        <!-- .uix-gallery end -->

									</div>





							</div>
						</div>
						<!-- .row end -->


				</div>
				<!-- .container end -->

			</div>	
			
		</main>
   

        		    		    	    	    
        		    	    	    	    
       <!-- Footer Demo
        ====================================================== -->
        <footer class="uix-special-footer__container is-transparent">
            <div class="uix-special-footer">
                <div class="container">

					<div class="row">
						  <div class="col-lg-3 col-md-3 uix-t-c--md">
							   <img class="logo" src="assets/images/logo-colorful.png" alt="">
						  </div>
						  <div class="col-lg-6 col-md-6">


								<div class="uix-special-footer__menus uix-special-footer__menus--mobile-nowrap">
									<div class="uix-special-footer__menus__list">
										<h3>About</h3>
										<ul>
											<li><a href="#">About us</a></li>
											<li><a href="#">Careers</a></li>
											<li><a href="#">Press</a></li>
											<li><a href="#">Policies</a></li>
											<li><a href="#">Help</a></li>
											<li><a href="#">Diversity & Belonging</a></li>
										</ul>
									</div>

									<div class="uix-special-footer__menus__list">
										<h3>Discover</h3>
										<ul>
											<li><a href="#">Trust & Safety</a></li>
											<li><a href="#">Travel Credit</a></li>
											<li><a href="#">Gift Cards</a></li>
											<li><a href="#">Airbnb Citizen</a></li>
											<li><a href="#">Business Travel</a></li>
											<li><a href="#">Guidebooks</a></li>
											<li><a href="#">Airbnbmag</a></li>
										</ul>
									</div>

									<div class="uix-special-footer__menus__list">
										<h3>Works</h3>
										<ul>
											<li><a href="#">Why Host</a></li>
											<li><a href="#">Hospitality</a></li>
											<li><a href="#">Responsible Hosting</a></li>
											<li><a href="#">Community Center</a></li>
										</ul>
									</div>
								</div><!-- /.uix-special-footer__menus -->     			  

						  </div>
						  <div class="col-lg-3 col-md-3 uix-t-r">

								<div class="uix-tooltip">
									<span data-microtip-position="top" data-microtip-size="medium" role="tooltip">
										<a class="uix-social-btn uix-social-btn--small uix-social-btn--circle uix-social-btn--thin is-fill-white" href="javascript:">
											<i class="fa fa-qrcode"></i>
										</a>
									</span>
									<div class="uix-t-c"><img src="assets/images/demo/qr-code.png" alt="" width="150" height="150" /></div>
								</div>	
							  
							 

								<a class="uix-social-btn uix-social-btn--small uix-social-btn--circle uix-social-btn--thin is-fill-white" title="Follow us on Twitter" href="https://twitter.com/uiux_lab" target="_blank">
									<i class="fa fa-twitter"></i>
								</a>
								<a class="uix-social-btn uix-social-btn--small uix-social-btn--circle uix-social-btn--thin is-fill-white" title="Follow us on Facebook" href="https://www.facebook.com/uiuxlabhome" target="_blank">
									<i class="fa fa-facebook"></i>
								</a>
								<a class="uix-social-btn uix-social-btn--small uix-social-btn--circle uix-social-btn--thin is-fill-white" title="Fork on Github" href="https://github.com/xizon/uix-kit" target="_blank">
									<i class="fa fa-github"></i>
								</a>   

						  </div>
					</div>


				</div><!-- .container  end -->
            
			</div>
				
        </footer> 
        
        
        
        
    </div>
    <!-- .uix-wrapper end -->
       
       
    @@include('./src/components/_global/include-footer.html')
    
   